<!doctype html>
<html xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <title>汽修管理系统</title>
    <script src="/public/jquery/jquery-1.11.1.min.js"></script>
    <script src="/public/vue/vue.js"></script>
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <link href="/master/css/mywork.css" rel="stylesheet"/>

    <style>
        body{margin: 0}
        #hword{line-height: 33px;margin-left: 7px;padding:20px 0 20px 20px;font-weight: bold;font-size: 14px;font-family: "宋体";color:rgb(0,0,0);background:url("/stencil/images/titleico.png")left center no-repeat;}
        .el-form-item{margin-bottom: 0}
        .el-form el-form--inline{padding: 6px 0 0 0;}
        .el-form-item__label{color:#46647e;}
        .el-input__inner{width:155px;height:30px;}
        #carPai .el-select .el-input__inner{width:60px}
        .el-scrollbar li{height:20px;line-height: 20px}
        #Carty{width:80px;}
        #second .el-form-item{margin-right: 0}
        #table-operate{padding-left:15px;height:37px;line-height:37px;border:1px solid #c1d3de;border-top:none;background:url("/stencil/images/toolbarbg.png") repeat-x;}
        .el-table .warning-row {background: oldlace;}
        .el-table .success-row {background: #f0f9eb;}
        .el-table thead{color:#606266}
        #dataReport{background: url("/stencil/images/righttitlebig.png") repeat-x; border:1px solid #c1d3de;overflow: visible;}
    </style>

</head>
<body>
<div id="dataReport" >
    <span id="hword">报表信息</span>
    <el-button size="mini" type="success" icon="el-icon-search" @click = "inquireReports" style="position: absolute;top:40px;right:35px;">查询</el-button>

    <!--查询表单-->
    <div>
        <el-form :inline="true" ref="form" :model="ruleForm" label-width="100px">
            <el-form-item  label="客户名称：">
                <el-input  v-model="ruleForm.names" placeholder="请输入客户名称"></el-input>
            </el-form-item>
            <el-form-item  label="车牌号码：">
                <el-input  v-model="ruleForm.carNum" placeholder="请输入车牌号码"></el-input>
            </el-form-item>

            <el-form-item  label="时间范围：">

                <el-date-picker
                        style="padding: 0px 15px"
                        v-model="ruleForm.times"
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期">
                </el-date-picker>

            </el-form-item>

        </el-form>
    </div>
    <!--数据展示表格-->
    <div>
        <template>
            <el-table
                    size="small"
                    :header-cell-style="{background:'#E7F0F6'}"
                    :data="listRule"

                    border
                    style="width: 100%">
                <el-table-column
                        prop="customername"
                        label="客户姓名">
                </el-table-column>
                <el-table-column
                        prop="phone"
                        label="电话号码">
                </el-table-column>
                <el-table-column
                        prop="carnumber"
                        label="车牌号码">
                </el-table-column>
                <el-table-column
                        prop="totalprice"
                        label="维修金额">
                </el-table-column>
                <el-table-column
                        prop="createtime"
                        label="时间">
                </el-table-column>

            </el-table>
        </template>
    </div>
</div>
</body>
<script src="/master/js/dataReport.js" type="application/javascript"></script>
</html>